import 'package:flutter/material.dart';

const double _bgHeight = 12;
const Color _bgColor = Color(0xffFFE211);

class DiscountBg extends StatelessWidget {
  final String discountInfo;

  const DiscountBg(this.discountInfo, {Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: _bgHeight,
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          _sliver(0.2),
          SizedBox(width: 2),
          _sliver(0.4),
          SizedBox(width: 2),
          _sliver(0.8),
          SizedBox(width: 2),
          ClipPath(
            clipper: DiscountBgClipper(),
            child: Container(
              height: _bgHeight,
              alignment: Alignment.center,
              padding: const EdgeInsets.only(left: 10, right: 7, top: 1),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.only(
                  topRight: Radius.circular(8),
                ),
                color: _bgColor,
              ),
              child: Opacity(
                opacity: 0.8,
                child: Text(
                  discountInfo,
                  style: TextStyle(fontSize: 10, color: Color(0xff4A2716), fontWeight: FontWeight.bold),
                ),
              ),
            ),
          )
        ],
      ),
    );
  }

  Widget _sliver(double opacity) {
    return Opacity(
      opacity: opacity,
      child: Transform.rotate(
        angle: 60 / 360,
        child: Container(
          height: _bgHeight + 2,
          color: _bgColor,
          width: 2.5,
        ),
      ),
    );
  }
}

class DiscountBgClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    double distance = 2;
    var path = Path();
    path.moveTo(distance, 0);
    // from(0, 0) and from top 2 bottom
    path.lineTo(0, size.height);
    path.lineTo(size.width, size.height);
    path.lineTo(size.width, 0);
    path.close();
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) {
    return false;
  }
}
